{%extends "admin/base.html" %}

{%block breadcrumb%}
<ol class="breadcrumb">
    <li class="breadcrumb-item"><a href="/admin">首页</a></li>
    <li class="breadcrumb-item"><a href="/admin/system/auth/index">系统权限组管理</a></li>
    <li class="breadcrumb-item active">{{title}}</li>
</ol>
{%endblock%}

{%block main%}
<div class="row">
    <div class="col-12">
        <div class="card card-success">
            <div class="card-header">
                <h3 class="card-title">
                    {{info.title}}
                    {%if info.status != 1%}
                    <small>已禁用</small>
                    {%endif%}
                </h3>
            </div>
            <form class="form-horizontal">
                <div class="card-body">
                    <div class="row">
                        {%for v in list%}
                        <div class="col-12 mb-2">
                            <div class="card card-outline card-success">
                                <div class="card-header icheck-primary d-inline">
                                    <input type="checkbox" name="node-root" id="{{v.node}}" {%if v.own==true%}checked{%endif%}>
                                    <label for="{{v.node}}">{{v.name}}</label>
                                </div>
                                <div class="card-body">
                                    <div class="row">
                                        {%for v1 in v.children%}
                                        <div class="col-sm-6 col-md-3 col-xl-2">
                                            <div class="icheck-success d-inline">
                                                <input type="checkbox" name="node[]" id="{{v.node}}:{{v1.node}}" value="{{v.node}}:{{v1.node}}" {%if v1.own==true%}checked{%endif%}>
                                                <label for="{{v.node}}:{{v1.node}}">{{v1.name}}</label>
                                            </div>
                                        </div>
                                        {%endfor%}
                                    </div>
                                </div>
                            </div>
                        </div>
                        {%endfor%}
                    </div>
                </div>
                <div class="card-footer">
                    <input type="hidden" name="id" value="{{info.id}}">
                    <button type="submit" class="btn btn-primary">提交</button>
                </div>
            </form>
        </div>
    </div>
</div>
{%endblock%}

{%block js%}
<script>
    $(function () {
        $('input[name="node-root"][type="checkbox"]').change(function () {
            _body = $(this).parent().next('.card-body');
            $(_body).find('input[name="node[]"]').prop('checked', $(this).prop('checked'));
        });

        $('form').submit(function (e) {
            e.preventDefault();
            $.post('{{ url("") }}', $('form').serialize(), function (res) {
                _msg = ('msg' in res) ? res.msg : '未知错误';
                if (!('code' in res) || res.code != 0) {
                    toastr.error(_msg);
                } else {
                    toastr.success('保存成功');

                    setTimeout(() => {
                        window.location.href = '{{ url("index") }}';
                    }, 3000);
                }
            });
        });
    });
</script>
{%endblock%}